<template>

  <div class="introucted_bg">
    <!-- 上方图片 -->
    <el-image :src='url' :fit='fit'></el-image>
    <!-- 面包屑 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item ><a href="/">首页</a></el-breadcrumb-item>
      <el-breadcrumb-item>师资介绍</el-breadcrumb-item>
    </el-breadcrumb>
    <!-- 分割线 -->
    <el-divider ></el-divider>
    <!-- 标签页 -->
    <el-tabs type="border-card" tab-position="top">
      <el-tab-pane label="舞蹈部">

      </el-tab-pane>
      <el-tab-pane label="唱歌部">

      </el-tab-pane>
      <el-tab-pane label="绘画部">

      </el-tab-pane>
      <el-tab-pane label="管理部门">

      </el-tab-pane>
    </el-tabs>

  </div>

</template>

<script>
  import nameImg from '@/assets/introuctedBG.jpg'
  export default {
    data() {
      return {
        fit: 'fill',
        url: nameImg
      }
    }
  }
</script>
<style>

  .introucted_bg {
    height: 1000px;
    width: 100%;
/*    background: url(../../assets/bg1.jpg) no-repeat;
    background-size: 100% 1000px; */
  }

  .introucted_bg .el-image {
    width: 100%;
    height: 37%;
    max-height: 370px;
    margin-top: 0%;
    margin-left: 0%;

  }
  .introucted_bg .el-breadcrumb{
    margin: 30px 15%;
    font-size: 14px;
  }
  .introucted_bg .el-divider {

    background: rgb(20,94,11);
    width: 88%;
    margin-left: 6%;

  }
  .introucted_bg .el-tabs{
     width: 70%;
     height: 50%;
     margin-left: 15%;
  }

/*  .info_bg .main_body{
    width: 80%;
    height: 50%;
    margin-top: 5%;
    margin-left: 10%;
  }
  .el-aside{
  }
  .el-aside .el-menu{
    text-align: center;
    margin-top: 25%;

  } */
</style>
